<template>
  <CustomDialog :drag-dialog="dialogInfo" style="z-index: 1201">
    <el-form
      ref="form"
      :model="form"
      :rules="rules"
      :disabled="!form.busPageInfo.editable"
      size="mini"
      label-width="160px"
    >
      <el-form-item label="账户" prop="busMainData.accountCode">
        <el-input v-model="form.busMainData.accountCode" :disabled="!isAdd" />
      </el-form-item>
      <el-form-item label="账户名称" prop="busMainData.accountName">
        <el-input v-model="form.busMainData.accountName" />
      </el-form-item>
      <el-form-item label="币别" prop="busMainData.priceCur">
        <el-select
          v-model="form.busMainData.priceCur"
          size="mini"
          filterable
          placeholder="币别"
        >
          <el-option
            v-for="item in dicts.bus_price_cur"
            :key="item.id"
            :label="item.dictName"
            :value="item.dictCode"
          />
        </el-select>
      </el-form-item>
      <el-form-item
        style="margin-bottom: 0px"
        label="科目"
        prop="busMainData.finCode"
      >
        <FinItemTreeSelect
          ref="finItemTreeSelect"
          v-model="form.busMainData.finCode"
          :data-trees="finItems"
          placeholder="选择科目"
        />
      </el-form-item>
      <el-form-item label="备注" prop="busMainData.busRmk">
        <el-input
          v-model="form.busMainData.rmk"
          size="mini"
          class="filter-item"
        />
      </el-form-item>
    </el-form>
    <div v-if="form.busPageInfo.editable" slot="footer" class="modal-footer">
      <el-button type="text" @click="cancel">取消</el-button>
      <el-button
        v-permission="[
          'SYS_ADMIN',
          'COMMON_ADMIN',
          'FIN_ACCOUNT_ALL',
          'FIN_ACCOUNT_CREATE',
        ]"
        :loading="loading"
        type="primary"
        @click="doSave"
        >保存</el-button
      >
    </div>
  </CustomDialog>
</template>

<script>
import finAccount from "@/api/fin/FinAccount";
import FinItemTreeSelect from "@/views/fin/baseitem/module/FinItemTreeSelect";
import finItem from "@/api/fin/FinItem";

export default {
  components: { FinItemTreeSelect },
  dictTypes: ["bus_price_cur"],
  props: {
    sup_this: {
      type: Object,
      required: true,
    },
  },
  data() {
    return {
      isAdd: false,
      loading: false,
      style: "width: 184px",
      finItems: [],
      dialogInfo: {
        name: "finAccountMngFormDialog",
        title: "会计科目维护",
        fullScreen: false,
        width: 500,
        height: 90,
      },
      form: {
        busMainData: {
          id: "",
          enableFlag: "Y",
        },
        busPageInfo: {
          editable: false,
        },
      },
      rules: {
        "busMainData.accountCode": [
          { required: true, message: "请输入账户", trigger: "blur" },
          {
            min: 3,
            max: 40,
            message: "长度在 3 到 40 个字符",
            trigger: "blur",
          },
        ],
        "busMainData.accountName": [
          { required: true, message: "请输入名称", trigger: "blur" },
          {
            min: 3,
            max: 50,
            message: "长度在 3 到 50 个字符",
            trigger: "blur",
          },
        ],
        "busMainData.finCode": [
          { required: true, message: "请输入科目", trigger: "blur" },
        ],
        "busMainData.priceCur": [
          { required: true, message: "请输入币别", trigger: "blur" },
        ],
      },
    };
  },
  created() {
    finItem.getFinItemData({ activeFlag: "Y" }).then((res) => {
      this.finItems = res.data;
    });
  },
  methods: {
    cancel() {
      this.resetForm();
    },
    initDataOfBefore() {},
    displayDialog() {
      const { name } = this.dialogInfo;
      this.$nextTick(() => {
        this.$modal.show(name);
      });
    },
    hiddenDialog() {
      const { name } = this.dialogInfo;
      this.$nextTick(() => {
        this.$modal.hide(name);
      });
    },
    addData() {
      this.isAdd = true;
      const data = { paramBean: {} };
      finAccount
        .toAdd(data)
        .then((res) => {
          this.displayDialog();
          this.form = res.data;
        })
        .catch((err) => {
          console.log(err);
        });
    },
    copyData(mainId) {
      this.isAdd = true;
      const data = { paramBean: { id: mainId } };
      finAccount
        .toCopy(data)
        .then((res) => {
          this.displayDialog();
          this.form = res.data;
        })
        .catch((err) => {
          console.log(err);
        });
    },
    viewMainData(id) {
      this.isAdd = false;
      const data = { paramBean: { id: id } };
      finAccount.viewMainData(data).then((res) => {
        this.displayDialog();
        this.form = res.data;
      });
    },
    doSubmit() {
      this.doSingleSave(true);
    },
    doSave() {
      this.doSingleSave(false);
    },
    doSingleSave(isSubmit) {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          this.form.formSubmit = isSubmit;
          this.loading = true;
          if (this.isAdd) {
            this.doAdd();
          } else {
            this.doEdit();
          }
        }
      });
    },
    doAdd() {
      finAccount
        .addOrEdit(this.form)
        .then((res) => {
          this.resetForm();
          this.loading = false;
          this.sup_this.init();
        })
        .catch((err) => {
          this.loading = false;
        });
    },
    doEdit() {
      finAccount
        .addOrEdit(this.form)
        .then((res) => {
          this.resetForm();
          this.loading = false;
          this.sup_this.init();
        })
        .catch((err) => {
          this.loading = false;
          // console.log(err)
        });
    },
    resetForm() {
      this.hiddenDialog();
      this.$refs["form"].resetFields();
    },
    changeData(busId) {
      const data = { paramBean: { id: busId } };
      finAccount
        .toChange(data)
        .then((res) => {
          this.displayDialog();
          this.form = res.data;
        })
        .catch((err) => {
          this.dialog = false;
          console.log(err);
        });
    },
  },
};
</script>
